<html>
    <head>
        <meta charset="utf-8">

        <!-- 浏览器端ak -->
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=RV3io7P1qcpsGeEfpXVXQYkmf8PcITgc"></script>
        <!-- ECharts-->
        <script src="./echarts/echarts3.8.5.min.js"></script>
        <script src="./echarts/bmap3.8.5.min.js"></script>
        <script src="./js/jquery.min.js"></script>
        <script src="./js/optionDbScan.js"></script>

        <style type="text/css">
            body {
                margin: 0;
                background: -webkit-linear-gradient(left, #DAE4E3, #C0D3D7);
            }
            #main {
                height: 100%;
            }
        </style>
    </head>
    <body>
        <div id="main"></div>

        <script>
            var startPoint = {
                x: [],
                y: []
            };
            var zoom = 12;
            var clusterNum = 0;

            var option = getOption(getDataJson(), clusterNum);
            drawMap(option, startPoint, zoom);

            function execute() {
                var option = getOption(getDataJson(), clusterNum);

                // -----drawMap-------
                //避免造成内存泄露
                if (myChart && myChart.dispose) {
                    myChart.dispose();
                }
                var myChart = echarts.init(document.getElementById('main'));
                myChart.clear();
                // 自适应
                window.onresize = myChart.resize;
                myChart.setOption(option);
                // 获取map实例
                var map = myChart.getModel().getComponent('bmap').getBMap();
                var point = new BMap.Point(startPoint.x, startPoint.y);
                // 中心点和缩放级别
                map.centerAndZoom(point, zoom);
                // 拖拽和缩放
                map.enableDragging();
                map.enableScrollWheelZoom();
            }

            function getDataJson() {
                return apps3.getDataJson();
            }

            function getStartPoint(x,y) {
                startPoint.x = x;
                startPoint.y = y;
            }

            function setZoom(x) {
                zoom = x;
            }

            function setClusterNum(x) {
                clusterNum = x;
            }

        </script>

    </body>
</html>